// 路由管理

// create router -> 创建路由
// create web history -> 创建web历史
import { createRouter, createWebHistory } from 'vue-router'
import {useAuthStore} from "@/store/auth.ts";
import { storeToRefs } from 'pinia'
// 引入的页面
import Login from '../views/Login.vue'
import Register from '../views/Register.vue'
import Home from '../views/Home.vue'

// 配置path & 组件的映射关系
const routes = [
  {
    path: '/',
    component: () => Home,
    meta: { requiresAuth: true }
  },
  {
    path: '/home',
    component: () => Home,
    meta: { requiresAuth: true }
  },
  {
    path: '/login',
    component: () => Login,
  },
  {
    path: '/register',
    component: () => Register,
  }
]

// 创建路由实例，指定路由模式是history模式
const router = createRouter({
  history: createWebHistory(),
  routes
})

// 创建路由守卫，简单鉴权
// to -> 要跳转的页面
// from -> 当前页面
// next -> 放行??
router.beforeEach((to, from, next) => {
  // 获取认证状态的Pinia store
  const authStore = useAuthStore()
  const { isAuthenticated, token } = storeToRefs(authStore)

  // 需要登录验证且用户未登录时跳转到登录页
  if (to.meta.requiresAuth && !isAuthenticated.value) {
    // 跳转到登录页
    console.log('需要登录验证且用户未登录时跳转到登录页')
    next('/login')
  }
  // 需要访客验证（即未登录才能访问）且用户已登录时跳转到首页
    else if (to.meta.requiresGuest && isAuthenticated.value) {
      next('/')
  }
  // 其他情况正常放行
  else {
    next()
  }
})

export default router
